<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>背景属性</title>
		<style>
			bod y{
				wight:100%;
				height: 10000000px;
				background-image: url(img/蜡笔小新.png);
				background-size: cover;
				/* 函数 cover 等比例放大图片 特点：原图按照比例放大存背景空间
				【开发者：背景图大小是否等于背景空间】
				    contain 等比例缩放图片 特点：图片按比例缩放存背景空间
					【开发者：背景图等比例显示在背景空间】
					*/
				   /* 背景附件--尺寸中存在cover或者contain */
				   background-attachment: fixed;
				   /* 背景图固定   scroll  不固定 */
			}
			div{
				width: 300px;
				height: 300px;
				background-color: #e4393c;
				background: #ffff00;
				background-image: url(img/蜡笔小新.png);
				/* 问题：  超大图-不显示   小图-显示
				 注意：背景空间大小，如果图小于背景空间---平铺
				 */
				background-repeat: no-repeat;
				/* no-repeat不平铺  repeat-x,y 横，纵向平铺*/
				background-size: 30%;
				/* 背景尺寸属性值：数值px % | 函数 cover contain*/
				/* 背景定位： 前提背景空间大于背景图 */
				background-position: 80% 0;
			}
		</style>
	</head>
	<body>
		Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptatibus reprehenderit quia et voluptatum, atque exercitationem quaerat corrupti illo modi eaque voluptates ad vero asperiores nemo facere, rerum iure hic quisquam.
		Lorem, ipsum dolor sit amet consectetur adipisicing elit. Obcaecati ad temporibus velit voluptates quam, vel rem perferendis dolore placeat, nesciunt doloribus sint corrupti dolorem ab maiores ratione est laudantium in.
		Lorem ipsum, dolor sit amet consectetur adipisicing elit. Voluptatibus saepe nulla architecto numquam ipsum voluptatum? Sint, provident. Quidem dolorum eos, debitis est possimus quasi odit autem et deleniti doloremque quisquam.
		<!-- html img图片  引入一张图片，位置不可随意改变
		     css 背景图 引入一张图片，位置可随意改变
			 子属性 background-color 背景颜色
			        background-image 背景图
					background-repeat
					background-size
					background-attcahment
					background-position
					
		     复合属性 background:background-image background-color background-position
				                background-size background-repeat和background-attachment
					 
			复合属性 background:background-image background-position	|background-size 
			替代子属性 background-image、background-color、background-repeat
			‘-->
			 <div></div>
	</body>
</html>